<template>
	<view class="extensionCode">
		<view class="extensionCode_haber" :style="{ paddingTop: (top+30) + 'px' }">
			<tui-navigation-bar maxOpacity="0" :titleSize="18" :titleLineHeight="18" :titlefontWeight="800"
				@init="initNavigation" title="我的推广码" backgroundColor="#fff" color="#000">
				<view class="tui-header-icon" :style="{ marginTop: top + 'px' }">
					<tui-icon name="arrowleft" color="#333" @click="back"></tui-icon>
				</view>
			</tui-navigation-bar>
			<view class="myExtensionCode">
				<image class="bgImg" :src="ossUrl+'2025/02/04/eede8a378de243a0a5bda0287b81d9da.jpg'"></image>
				<view class="myid">
					<text>我的ID：{{userId}}</text>
				</view>
				<view class="qrCode">
					<canvas :style="{ width: qrcode_w + 'px', height: qrcode_w + 'px' }" canvas-id="couponQrcode"
						id="couponQrcode"></canvas>
				</view>
				<image class="shareBg" src="/static/user/my/button_shaare@2x.png"></image>
			</view>
		</view>


	</view>
</template>

<script>
	import {
		getUserinfo
	} from '@/http/api/user/user.js'
	import Cache from "@/utils/cache";
	import qrCode from '@/utils/weapp-qrcode.js';
	export default {
		data() {
			return {
				top: 0, //标题图标距离顶部距离
				marginTp: 0,
				userId: '',
				ossUrl: getApp().globalData.ossurl, //图片前缀
				qrcode_w: uni.upx2px(300)
			}
		},
		onReady() {
			//需等canvas初始化完成才可执行方法
			//couponQrcode 为canvas-id
			let userId = Cache.get('userId')
			this.userId = userId
			new qrCode('couponQrcode', {
				text: userId,
				width: this.qrcode_w,
				height: this.qrcode_w,
				colorDark: '#333333',
				colorLight: '#FFFFFF',
				correctLevel: qrCode.CorrectLevel.H
			});
		},
		methods: {
			initNavigation(e) {
				this.top = e.top;
				this.marginTp = e.height;
			},
			back() {
				uni.navigateBack({
					delta: 1
				});;
			},
			get_data(){
				getUserinfo(this.userId).then(res=>{
					console.log('getUserinfo',res)
				})
			}
		},
		onShow() {
			this.get_data()
		}
	}
</script>

<style lang="scss" scoped>
	@import './extensionCode.scss';
</style>